<template>
    <div>
        <el-button type="primary" @click="showDialog('insert')">新增</el-button>
        <el-table :data="tableData" :highlight-current-row="true" stripe border class="table-index"  style="width: 100%;" :height="tableHeight"
        :header-cell-style="getRowClass" v-loading="loading" >
            <el-table-column prop="name" label="工序名称"  sortable min-width="60"></el-table-column>
            <el-table-column prop="code" label="工序编码" sortable min-width="100"></el-table-column>
            <el-table-column prop="enable" label="启用" sortable  min-width="140"></el-table-column>
            <el-table-column fixed="right" label="操作" align="center" width="100">
                <template slot-scope="scope">
                    <el-button @click="showDialog('update',scope.row)" type="text" size="mini">详情</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pagination.currentPage" :page-sizes="[5,10, 15,20, 25,30,50, 100]" :page-size="pagination.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"></el-pagination>
        <el-dialog :title="dialog.title" :visible.sync="dialog.open">
            <el-form ref="form" :model="dialog.fromData" label-width="80px">
                <el-form-item label="工序名称">
                    <el-input v-model="dialog.fromData.name" class="width220"></el-input>
                </el-form-item>
                <el-form-item label="工序编码">
                    <el-input v-model="dialog.fromData.code" class="width220"></el-input>
                </el-form-item>
                <el-form-item label="启用" class="width220">
                    <el-switch v-model="dialog.fromData.enable"></el-switch>
                </el-form-item>
                <el-form-item label="创建者" v-if="dialog.type==='update'">
                    <el-input v-model="dialog.fromData.creatorName" class="width220"></el-input>
                </el-form-item>
                <el-form-item label="创建时间"  v-if="dialog.type==='update'">
                    <el-input v-model="dialog.fromData.createTime" class="width220"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">确认</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
</div>

</template>
<script>
import hcHttp from '@/axios/hcHttp.js'
import cgbHttp from '@/axios/cgbHttp.js'
export default {
    data(){
        return {
            tableHeight: document.documentElement.clientHeight - 170,/**表格高度 */
            loading:false,/**加载参数 */
            tableData:[],/**表格数据列表 */
            pagination:{
                currentPage:1,
                pageSize:10,
                total:0
            },
            dialog:{
                title:'',
                open:false,
                fromData:{},
                type:''
            }

        }
    },
    created(){
        this.getDataList();
    },
    methods:{
        handleSizeChange(size){
            this.pagination.pageSize=size;
            this.getDataList();
        },
        handleCurrentChange(current){
            this.pagination.currentPage=current;
            this.getDataList();
        },
        getDataList(){
            let self= this;
            self.loading = true;
            let postData={
                currentPage:self.pagination.currentPage,
                pageSize:self.pagination.pageSize
            }
            hcHttp.getProcedureList(postData).then(res=>{
                self.loading=false;
                self.tableData= res.content.records;
                self.pagination.total = res.content.total
            },error=>{
                self.loading=false;
            })
        },
        showDialog(type,row){
            let self = this;
            self.dialog.open= true;
        },
        onSubmit(){

        }
    }
}
</script>
<style scoped>
.icon-circle{
    line-height: 100%;
    font-size:18px;
}
.myImage{
   width:auto;
   height: auto;
    max-width: 100%;
    max-height: 100%;
}
 .el-table .warning-row {
 background: rgba(0,255,255, 0.5);
  }
</style>
